<style>
    xm-select {
        min-height: 32px;
        line-height: 32px;
        border-radius: 5px;
    }
    .companyFormPhotos {
        /* margin-left:140px; */
        line-height: 38px;
        float: left;
        margin-right: 30px;
    }

    .companyFormPhotos img {
        cursor: pointer;
        height: 38px;
        width: auto;
        max-width: 200px;
    }

    .claimedDetails, .claimedLifeCycle {
        width: 100%;
        background-color: #F0F2F5;
        border: 1px solid #ccc;
        padding: 5px 10px;
        box-sizing: border-box;
        margin-bottom: 20px;
    }

    .claimedDetails input {
        width: 50px;
    }

    .claimedDetails .layui-form-label {
        padding: 10px 6px;
        width: auto;

    }

    .claimedDetails .layui-form-item {
        margin-bottom: 0;
    }

    .claimedDetails .layui-form-item .layui-input-inline {
        width: auto;
        margin-right: 5px;
    }

    .claimedDetails .layui-input {
        line-height: 36px;

    }

    .claimedDetails .layui-input, .claimedDetails .layui-textarea {
        display: block;
        width: 100%;
        padding-left: 0px;
        border: transparent;
        background-color: transparent;
    }

    .claimedDetails .layui-textarea {
        width: 100%;
        resize: none;
        padding-top: 10px;
    }

    .claimedDetails .claimedDetailsConfidential {
        display: inline-block;
        width: auto;
        max-width: 100%;
        min-width: 350px;
        min-height: 40px;
        box-sizing: border-box;
        background-color: rgb(251, 241, 241);
        border: 1px dashed #FF5722;
        color: #FF5722;
        margin: 10px 0;
        cursor: pointer;
    }

    .orderSecret {
        display: inline-block;
        width: auto;
        max-width: 100%;
        min-width: 350px;
        min-height: 40px;
        box-sizing: border-box;
        background-color: rgb(251, 241, 241);
        border: 1px dashed #FF5722;
        color: #FF5722;
        margin: 10px 0;
        cursor: pointer;
        overflow: hidden;
    }
    .orderSecret div{
        overflow: hidden;
        line-height: 38px;
    }

    .layui-form-item .layui-inline {
        margin: 0;
    }

    .claimedLifeCycle {
        border: none;
        padding: 0;
    }

    .claimedLifeCycle .bill-title {
        width: 100%;
        height: 40px;
        font-size: 15px;
        font-weight: 500;
        background: #F9FAFE;
        position: relative;
        display: flex;
        align-items: center;
        /*margin: 10px 0;*/
        box-sizing: border-box;
    }

    .claimedLifeCycle .bill-title:before {
        content: " ";
        display: inline-block;
        width: 4px;
        height: 100%;
        background: #009C5E;
        margin-right: 10px;
    }

    .claimedLifeCycleTitleBtn {
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
        color: #524f4f;
        cursor: pointer;
    }

    .claimedLifeCycle .claimedLifeCycleBox {
        box-sizing: border-box;
        padding: 0 20px;
        overflow: hidden;
    }

    .open-details-box::-webkit-scrollbar {
        display: none;
    }

    .criticBox {
        margin-top: 10px
    }

    .criticBox:after {
        content: "";
        clear: both;
        display: block;
    }

    .criticBox > div {
        float: left;
    }

    .criticBox .criticUserImg {
        width: 50px;
        height: 50px;

    }

    .criticUserImg > img {
        width: 35px;
        height: 35px;
        border-radius: 50%;
    }

    .criticBoxNewsHeader {
        background-color: #fff;
        line-height: 26px;
        box-sizing: border-box;
        box-shadow: 0px 0px 8px #ccc;
        padding: 10px;
        position: relative;
    }

    .criticBoxNewsHeader:before {
        content: "";
        position: absolute;
        width: 0;
        height: 0;
        border: 10px solid transparent;
        border-right-color: #FFf;
        left: -18px;
    }

    .criticBoxNewsMain {
        background-color: #e9e9e9;
        box-sizing: border-box;
        padding: 5px 10px;
        margin-top: 10px;
    }

</style>
<!-- 正文开始 -->
<div class="layui-fluid">
    <div class="layui-card">
        <div class="layui-card-body">
            <!-- 头部操作栏 -->
            <form class="layui-form" name="feedbackWorkOrderForm">
                <div class="layui-form lay-header">
                    <div class="toolbar">
                        <div class="layui-form-item lay-query-content">
                            <div class="lay-query-box">
                                <div class="query-lt">
                                    <div class="layui-inline">
                                        <label class="layui-form-label w-auto">工单编号：</label>
                                        <div class="layui-input-inline">
                                            <input name="workOrderCode" class="layui-input" type="text" placeholder="工单编号"/>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label w-auto">选择物料：</label>
                                        <div class="layui-input-inline">
                                            <select name="productId"></select>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label w-auto">描述关键字：</label>
                                        <div class="layui-input-inline">
                                            <input name="content" class="layui-input" type="text" placeholder="描述关键字"/>
                                        </div>
                                    </div>
                                    <div class="layui-inline" id="feedbackNameBox">
                                        <label class="layui-form-label w-auto">反馈类型：</label>
                                        <div class="layui-input-inline">
                                            <input name="feedbackId" type="hidden"/>
                                            <div id="feedbackName" class="xm-select-demo"></div>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label w-auto">提交人：</label>
                                        <div class="layui-input-inline">
                                            <input name="submitterName" class="layui-input" type="text" placeholder="请选择物料"/>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label w-auto">反馈状态：</label>
                                        <div class="layui-input-inline">
                                            <input name="enterpriseStatusDesc" class="layui-input" type="text" placeholder="请选择物料"/>
                                        </div>
                                    </div>
                                    <div class="layui-inline">
                                        <label class="layui-form-label w-auto">提交时间：</label>
                                        <div class="layui-input-inline">
                                            <input name="createTime" class="layui-input" type="text" placeholder="提交时间" id="createTime"/>
                                        </div>
                                    </div>
                                </div>
                                <div class="query-rt">
                                    <div class="layui-inline">
                                        <button type="button" class="layui-btn icon-btn color-green"
                                                lay-filter="formSubSearchLog" lay-submit >查询
                                        </button>
                                        <button type="button" class="layui-btn icon-btn color-white" lay-filter="resets" lay-submit>
                                            重置
                                        </button>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="lay-btn-rows">
                        <div class="lay-btn-box">
                            <div class="lay-btn-lt">
                                <button id="feedbackWorkOrderBtnAdd" class="layui-btn icon-btn color-reseda" type="button">添加
                                </button>
                            </div>
                            <div class="lay-btn-rt">
                            </div>
                        </div>
                    </div>
                </div>
            </form>
            <!-- 表格 -->
            <table class="layui-table" id="feedbackWorkOrderTable" lay-filter="feedbackWorkOrderTable"></table>
        </div>
    </div>
</div>

<!-- 表格操作列 -->
<script type="text/html" id="feedbackWorkOrderTableBar">

    {{# if(d.enterpriseStatus=='acceptance'){  }}
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="feedback">详细</a>
    {{#       }     }}
    {{# if(d.enterpriseStatus=='reply' && d.showFeedbackBtn=='1'){ }}
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="feedback">反馈</a>
    {{#     }     }}
    {{# if(d.enterpriseStatus=='reply' && d.showFeedbackBtn=='0'){ }}
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="feedback">详细</a>
    {{#     }     }}
    {{#  if(d.enterpriseStatus=='processing'){  }}
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="feedback">反馈</a>
    {{#       }     }}
    {{#  if(d.enterpriseStatus=='close'){  }}
    <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="feedback">详细</a>
    {{#       }     }}

</script>

<!-- 表单弹窗 -->
<script type="text/html" id="feedbackWorkOrderForm">
    <form lay-filter="feedbackWorkOrderForm" class="layui-form model-form">
        <input name="id" type="hidden"/>
        <div class="layui-form-item">
            <label class="layui-form-label">物料模块</label>
            <div class="layui-input-block">
                <select name="productId" id="productId" lay-verify="required" placeholder="请选择物料模块"
                        lay-filter="productId" lay-search="">
                    <option value="">请选择</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">模块</label>
            <div class="layui-input-block">
                <input name="moduleId" value="" type="hidden">
                <div id="moduleId" class="xm-select-demo"></div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">反馈类型</label>
            <div class="layui-input-block">
                <input name="feedbackId" value="" type="hidden"/>
                <div id="feedbackId" class="xm-select-demo"></div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">优先级</label>
            <div class="layui-input-block">
                <select name="priority" id="priority">
                    <option value="ordinary">一般</option>
                    <option value="urgency">紧急</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">内容</label>
            <div class="layui-input-block">
                <textarea name="content" style="resize: none;" maxlength="1000" class="layui-textarea"
                          placeholder="请输入内容(1000字以内)"></textarea>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">机密信息</label>
            <div class="layui-input-block">
                <input name="secretInformation" placeholder="请输入机密信息" type="text" class="layui-input"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">手机号</label>
            <div class="layui-input-block">
                <input name="phone" placeholder="请输入手机号" type="text" class="layui-input" lay-verify="phone"
                       required/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">邮箱</label>
            <div class="layui-input-block">
                <input name="mailbox" placeholder="请输入邮箱" type="text" class="layui-input" lay-verify="email"
                       required/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">上传附件</label>
            <div class="layui-input-block">
                <div id="addHeaderImg" class="companyFormPhotos"></div>
                <div id="addDevicePicBtn" class="layui-btn" style="float: left;margin-left: 3px"><i class="layui-icon">&#xe681;</i>上传文件
                </div>
                <input name="fileId" id="fileId" type="hidden" class="layui-input" lay-verify=""/>
            </div>
        </div>
        <div class="layui-form-item text-right">
            <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
            <button class="layui-btn" lay-filter="feedbackWorkOrderFormSubmit" lay-submit>保存</button>
        </div>
    </form>
</script>


<!--反馈弹窗-->
<!--feedbackForm-->
<script type="text/html" id="feedbackForm">
    <form lay-filter="feedbackForm" class="layui-form model-form"
          style="padding: 5px 10px 0;height: calc(100% - 5px);overflow: hidden;">
        <div class="open-details-box" style="height: calc(100% - 65px); overflow-y: scroll;">
            <div class="claimedDetails">
                <div class="layui-form-item">
                    <label class="layui-form-label">工单状态:</label>
                    <div class="layui-input-inline">
                        <input name="workOrderStatusDesc" type="text" class="layui-input" readonly="true"
                               style="color: #FF5722"/>
                    </div>
                    <label class="layui-form-label">计划工时:</label>
                    <div class="layui-input-inline">
                        <input name="planCompletionTime" type="text" class="layui-input" readonly="true"
                               style="color: #FF5722;width: 80px"/>
                    </div>
                    <div class="layui-form-mid layui-word-aux" style="line-height: 22px; margin-right: 60px">小时</div>
                    <label class="layui-form-label">实际工时:</label>
                    <div class="layui-input-inline">
                        <input name="actualHourTime" type="text" class="layui-input" readonly="true"
                               style="color: #FF5722;"/>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">问题描述:</label>
                    <div class="layui-input-inline" style="width: calc(100% - 80px);height: auto">
                        <textarea class="layui-textarea" readonly="true" name="content"></textarea>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="claimedDetailsConfidential">
                        <label class="layui-form-label">机密信息：</label>
                        <div class="layui-input-inline">
                            <div id="claimedDetailsSecretInformation" style="min-width: 400px;line-height: 40px"></div>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <label class="layui-form-label">附件:</label>
                    <div class="layui-inline">
                        <div class="companyFormPhotos" id="attachment"></div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">工单编号:</label>
                        <div class="layui-input-inline">
                            <input name="workOrderCode" type="text" class="layui-input" readonly="true"/>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">工单类型:</label>
                        <div class="layui-input-inline">
                            <input name="feedbackName" type="text" class="layui-input" readonly="true"/>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">物料:</label>
                        <div class="layui-input-inline">
                            <input name="productName" type="text" class="layui-input" readonly="true"/>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">模块:</label>
                        <div class="layui-input-inline">
                            <input name="moduleName" type="text" class="layui-input" readonly="true"/>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">优先级:</label>
                        <div class="layui-input-inline">
                            <input name="priorityDesc" type="text" class="layui-input" readonly="true"/>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">提交人:</label>
                        <div class="layui-input-inline">
                            <input name="submitterName" type="text" class="layui-input" readonly="true"/>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">创建时间:</label>
                        <div class="layui-input-inline">
                            <input name="createTime" type="text" class="layui-input" readonly="true"/>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">手机号:</label>
                        <div class="layui-input-inline">
                            <input name="phone" type="text" class="layui-input" readonly="true"/>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">邮箱:</label>
                        <div class="layui-input-inline">
                            <input name="mailbox" type="text" class="layui-input" readonly="true"/>
                        </div>
                    </div>
                </div>
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <label class="layui-form-label">认领人:</label>
                        <div class="layui-input-inline">
                            <input name="receiptorName" type="text" class="layui-input" readonly="true"/>
                        </div>
                    </div>
                    <div class="layui-inline">
                        <label class="layui-form-label">认领时间:</label>
                        <div class="layui-input-inline">
                            <input name="receiptorTime" type="text" class="layui-input" readonly="true"/>
                        </div>
                    </div>
                    <div class="layui-inline" id="activateTimeBox">
                        <label class="layui-form-label">激活时间:</label>
                        <div class="layui-input-inline">
                            <input name="activateTime" type="text" class="layui-input" readonly="true"/>
                        </div>
                    </div>
                </div>
            </div>
            <div class="claimedLifeCycle">
                <div class="bill-title">
                    <p>工单生命周期</p>
                    <span class="claimedLifeCycleTitleBtn">收起<i class="layui-icon layui-icon-down"></i></span>
                </div>
                <div class="claimedLifeCycleBox layui-anim layui-anim-up layui-anim-upbit">
                    <ul class="layui-timeline" style="margin-top: 20px" id="claimedLifeCycleBoxList"></ul>
                </div>
            </div>
        </div>

        <div class="layui-form-item text-right" style="margin-top: 20px">
            <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
        </div>
    </form>
</script>

<!--回复消息-->
<script type="text/html" id="criticForm">
    <form lay-filter="criticForm" class="layui-form model-form"
          style="padding: 5px 10px 0;height: calc(100% - 5px);overflow: hidden;">
        <div class="open-details-box" style="height: calc(100% - 65px); overflow-y: scroll;">
            <div class="layui-form-item">
                <div class="" style="background-color: #EFEFEF;">
                    <p style="padding: 6px 10px; font-size: 16px">
                        <span id="criticFormReplierName"></span>
                        <span id="criticFormCreateTime" style="font-size: 8px;margin-left: 15px;color: #7c7b7b"></span>
                    </p>
                    <textarea id="criticFormContent" style="resize: none; border: none; background-color: #EFEFEF; "
                              disabled
                              class="layui-textarea">
                    </textarea>
                </div>
            </div>
            <div class="layui-form-item">
                <label class="layui-form-label w-auto" style="color: #ff0000">机密信息：</label>
                <div class="layui-input-block">
                    <input name="confidential" class="layui-input" type="text" placeholder="请输入机密信息"/>
                </div>
            </div>
            <div class="layui-form-item">
                <textarea name="content" style="resize: none;" class="layui-textarea" maxlength="1000"
                          lay-verify="required" placeholder="请输入回复内容"></textarea>
            </div>
        </div>

        <div class="layui-form-item text-right" style="margin-top: 20px">
            <button class="layui-btn" type="button" lay-filter='criticFormSubmit' lay-submit>回复</button>
            <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
        </div>
    </form>
</script>


<!-- js部分 -->
<script>
    layui.use(['layer', 'form', 'table', 'admin', 'layedit', 'upload', 'dropdown', 'util','laydate'], function () {
        var $ = layui.jquery;
        var layer = layui.layer;
        var form = layui.form;
        var table = layui.table;
        var config = layui.config;
        var admin = layui.admin;
        var layedit = layui.layedit;
        var upload = layui.upload;
        let laydate = layui.laydate;
        let parentData = '';

        laydate.render({
            elem: '#createTime',
        });

        // 加载物料模块
        admin.req('user/admin/menu/getAllParentMenu', {}, function (res) {
            if (res.code === 200) {
                loadSelectHtml(res.data, '请选择物料', 'productId', 1, 'feedbackWorkOrderForm')
            }
        }, 'GET', false);

        //加载物料反馈分类树级菜单
        let feedbackNameArr2tree;
        admin.req('enterprisecab/work/admin/feedbackWorkOrder/getProductFeedbackCategory', {}, function (res) {
            for (let i = 0; i < res.data.length; i++) {
                res.data[i].children = [];
            }
            feedbackNameArr2tree =  xmSelect.arr2tree(res.data.data, "parentId", "id", "children", -1);

        }, 'GET', false);

        let feedbackNameSelectedData = function (treeData, targetId) {
            for (var k = 0; k < treeData.length; k++) {
                var nodeId = treeData[k].id;
                if (targetId == nodeId) {
                    treeData[k].selected = true;
                    return;
                } else {
                    if (treeData[k].children && treeData[k].children != '') {
                        feedbackNameSelectedData(treeData[k].children, targetId);
                    }
                }
            }
        };

       let workxmSelect = xmSelect.render({
            el: '#feedbackName',
            model: {label: {type: 'text'}},
            radio: true,
            clickClose: true,
            filterable: true,
            tree: {
                show: true,
                strict: false,
                expandedKeys: [-1],
            },
            tips: '顶级分类',
            prop: {
                name: 'name',
                value: 'id',
                children: 'children'
            },
            data() {
                //填充数据
                return feedbackNameArr2tree;
            },
            on(data) {
                let parentId = data.arr.length > 0 ? data.change[0].id : -1;
                //
                $("#feedbackNameBox input[name='feedbackId']").val(parentId);
            }
        });

        form.render("select");

        // 渲染表格
        var insTb = table.render({
            elem: '#feedbackWorkOrderTable',
            url: config.base + 'enterprisecab/work/admin/feedbackWorkOrder/list?wordOrderType=0',
            toolbar: true,
            defaultToolbar: ["filter"],
            page: true,
            cellMinWidth: 100,
            cols: [[
                {type: 'numbers'}
                , {field: 'workOrderCode', sort: false, title: '工单编号'}
                , {field: 'productName', sort: false, title: '物料'}
                , {field: 'moduleName', sort: false, title: '模块'}
                , {field: 'content', sort: false, title: '问题描述'}
                , {field: 'feedbackName', sort: false, title: '反馈类型'}
                , {field: 'submitterName', sort: false, title: '提交人'}
                , {field: 'priorityDesc', sort: false, title: '优先级'}
                , {field: 'createTime', sort: false, title: '提交时间'}
                , {field: 'enterpriseStatus', sort: false, title: '反馈状态',templet:function (d) {
                    if(d.enterpriseStatus == 'reply'){
                        return "处理中";
                    }
                    return d.enterpriseStatusDesc
                }}
                , {field: 'actualFinishTime', sort: false, title: '最后处理时间'}
                , {align: 'center', toolbar: '#feedbackWorkOrderTableBar', title: '操作', width: 200}
            ]],
            done: function (res, curr, count) {
            }
        });

        // 工具条点击事件
        table.on('tool(feedbackWorkOrderTable)', function (obj) {
            var data = obj.data;
            if (obj.event === 'edit') { //修改
                showEditModel(data);
            } else if (obj.event === 'del') { // 删除
                doDelete(obj);
            } else if (obj.event === 'feedback') {
                showFeedback(data);
                parentData = data;
            }
        });

        //监听排序
        table.on('sort(feedbackWorkOrderTable)', function (obj) {
            table.reload('feedbackWorkOrderTable', {
                initSort: obj
                , where: {
                    sort: obj.field
                    , order: obj.type
                }
            });
        });

        // 搜索
        form.on('submit(formSubSearchLog)', function (data) {
            insTb.reload({where: data.field, page: {curr: 1}}, 'data');
        });

        // 重置搜索
        form.on('submit(resets)', function (data) {
            $(".lay-header").find('select').val("");
            $(".lay-header").find('input').val("");
            let field = data.field;
            for(let key in field){
                field[key] = ''
            }
            insTb.reload({where: field,page: {curr: 1}},'data');
            workxmSelect.setValue([{name:''}])
        });

        // 添加按钮点击事件
        $('#feedbackWorkOrderBtnAdd').click(function () {
            showEditModel();
        });

        // 显示编辑弹窗
        function showEditModel(data) {
            admin.open({
                type: 1,
                area: '1220px',
                offset: '65px',
                title: data ? '修改工单表' : '添加工单表',
                content: $('#feedbackWorkOrderForm').html(),
                success: function () {
                    // 加载物料模块
                    admin.req('user/admin/menu/getAllParentMenu', {}, function (res) {
                        var types = res.data;
                        var productId = $("#productId");
                        $.each(types, function (index, item) {
                            productId.append("<option value=" + item.id + ">" + item.name + "</option>");
                        });
                        form.render("select");
                    }, 'GET', false);

                    // 监听物料模块下拉框  加载模块
                    form.on('select(productId)', function (data) {
                        let parentId = data.value;
                        if (parentId != null) {
                            let moduleTree;
                            admin.req('user/admin/menu/getMenuByParentId', {}, function (res) {
                                for (let i = 0; i < res.data.length; i++) {
                                    res.data[i].children = [];
                                }
                                moduleTree = xmSelect.arr2tree(res.data, "parentId", "id", "children", parentId);
                            }, 'GET', false);

                            let selectedData = function (treeData, targetId) {
                                for (var k = 0; k < treeData.length; k++) {
                                    var nodeId = treeData[k].id;
                                    if (targetId == nodeId) {
                                        treeData[k].selected = true;
                                        return;
                                    } else {
                                        if (treeData[k].children && treeData[k].children != '') {
                                            selectedData(treeData[k].children, targetId);
                                        }
                                    }
                                }
                            }
                            if (data) {
                                selectedData(moduleTree, data.moduleId);
                            }

                            xmSelect.render({
                                el: '#moduleId',
                                model: {label: {type: 'text'}},
                                radio: true,
                                clickClose: true,
                                filterable: true,
                                tree: {
                                    show: true,
                                    strict: false,
                                    expandedKeys: [data.moduleId],
                                },
                                prop: {
                                    name: 'name',
                                    value: 'id',
                                    children: 'children'
                                },
                                data() {
                                    //填充数据
                                    return moduleTree;
                                },
                                on(data) {
                                    let parentId = data.arr.length > 0 ? data.change[0].id : -1;
                                    $("input[name='moduleId']").val(parentId);
                                }
                            });
                        }

                    })

                    var layeditIndex15 = layedit.build('content', {
                        uploadImage: {
                            url: config.upload_url + 'layuiUpload?access_token=' + config.getToken(),
                            type: 'post'
                        }
                    });

                    //加载物料反馈分类树级菜单
                    var arr2tree;
                    admin.req('enterprisecab/work/admin/feedbackWorkOrder/getProductFeedbackCategory', {}, function (res) {
                        for (let i = 0; i < res.data.data.length; i++) {
                            res.data.data[i].children = [];
                        }
                        arr2tree = xmSelect.arr2tree(res.data.data, "parentId", "id", "children", -1);
                    }, 'GET', false);

                    var selectedData = function (treeData, targetId) {

                        for (var k = 0; k < treeData.length; k++) {
                            var nodeId = treeData[k].id;
                            if (targetId == nodeId) {
                                treeData[k].selected = true;
                                return;
                            } else {
                                if (treeData[k].children && treeData[k].children != '') {
                                    selectedData(treeData[k].children, targetId);
                                }
                            }
                        }
                    }

                    if (data) {
                        selectedData(arr2tree, data.feedbackId);
                    }

                    xmSelect.render({
                        el: '#feedbackId',
                        model: {label: {type: 'text'}},
                        radio: true,
                        clickClose: true,
                        filterable: true,
                        tree: {
                            show: true,
                            strict: false,
                            expandedKeys: [-1],
                        },
                        tips: '顶级分类',
                        prop: {
                            name: 'name',
                            value: 'id',
                            children: 'children'
                        },
                        data() {
                            //填充数据
                            return arr2tree;
                        },
                        on(data) {
                            let parentId = data.arr.length > 0 ? data.change[0].id : -1;
                            //
                            $("input[name='feedbackId']").val(parentId);
                        }
                    });


                    if (data) {
                        var option = $("form select[name='priority']").find("option");
                        layui.each(option, function (index, item) {
                            if (data.priority == item.text) {
                                data.priority = item.value;
                            }
                        });
                    }
                    $('#addDevicePicBtn').click(uploadImg('addDevicePicBtn', 'addHeaderImg', 'fileId'));
                    form.render("select");
                    form.val('feedbackWorkOrderForm', data);
                    // 表单提交事件
                    form.on('submit(feedbackWorkOrderFormSubmit)', function (d) {
                        layer.load(2);
                        d.field.wordOrderType ='feedback';
                        admin.req(data ? 'enterprisecab/work/admin/feedbackWorkOrder/update' : 'enterprisecab/work/admin/feedbackWorkOrder/add', d.field, function (res) {
                            layer.closeAll('loading');
                            if (res.code == 200) {
                                layer.msg(res.msg, {icon: 1});
                                table.reload('feedbackWorkOrderTable');
                                layer.closeAll('page');
                            } else {
                                layer.msg(res.msg, {icon: 2});
                            }
                        }, data ? 'PUT' : 'POST');
                        return false;
                    });
                }
            });
        }

        // 删除
        function doDelete(obj) {
            layer.confirm('确定要删除吗？', {
                offset: '65px',
                skin: 'layui-layer-admin'
            }, function (i) {
                layer.close(i);
                layer.load(2);
                admin.req('enterprisecab/work/admin/feedbackWorkOrder/' + obj.data.id, {}, function (res) {
                    layer.closeAll('loading');
                    if (res.code == 200) {
                        layer.msg(res.msg, {icon: 1});
                        obj.del();
                    } else {
                        layer.msg(res.msg, {icon: 2});
                    }
                }, 'DELETE');
            });
        }

        // 反馈
        function showFeedback(_data) {
            let claimedLifeCycleBoxIsShow = true;
            admin.open({
                type: 1,
                area: ['1280px', '800px'],
                offset: '65px',
                title: '工单反馈详细',
                content: $('#feedbackForm').html(),
                success: function () {
                    form.val('feedbackForm', _data);
                    if(_data.activateTime !=''){
                        $('#activateTimeBox').show()
                    }else {
                        $('#activateTimeBox').remove();
                    }
                    $('#claimedDetailsSecretInformation').html(encryption(_data.secretInformation));

                    $('[lay-filter="feedbackForm"]').delegate('.orderSecretBox','mouseover',function () {
                        $(this).text(untie($(this).text()))
                    });
                    $('[lay-filter="feedbackForm"]').delegate('.orderSecretBox','mouseout',function () {
                        $(this).text(encryption($(this).text()))
                    });

                    $('#claimedDetailsSecretInformation').hover(function () {
                        $(this).html(_data.secretInformation)
                    }, function () {
                        $(this).html(encryption(_data.secretInformation));
                    });

                    $('#claimedDetailsContent').html(_data.content);
                    $('#attachment').html('<a target="_blank" href="' + _data.fileId + '">' + _data.fileId.substring(_data.fileId.lastIndexOf("/") + 1, _data.fileId.length) + '</a>');

                    // 收起
                    $('.claimedLifeCycleTitleBtn').click(function () {
                        claimedLifeCycleBoxIsShow = !claimedLifeCycleBoxIsShow;
                        if (claimedLifeCycleBoxIsShow) {
                            $('.claimedLifeCycleBox').slideDown();
                            $(this).find('i').removeClass('layui-icon-right').addClass('layui-icon-down');
                        } else {
                            $('.claimedLifeCycleBox').slideUp();
                            $(this).find('i').removeClass('layui-icon-down').addClass('layui-icon-right');
                        }
                    });
                    timelineData(_data)
                }
            })
        }

        // 请求时间轴数据
        function timelineData(_data) {
            $('#claimedLifeCycleBoxList').html('');
            let productName = '' ,moduleName= '';
            if(_data.productName == ''){
                productName= '';
                moduleName = '【'+_data.otherModule+'】';
            }else {
                productName= '【'+_data.productName+'】';
                moduleName = '【'+_data.moduleName+'】';
            }
            let claimedLifeCycleBoxListOne = `
                    <li class="layui-timeline-item">
                            <i class="layui-icon layui-timeline-axis"></i>
                            <div class="layui-timeline-content layui-text">
                                <h3 class="layui-timeline-title">提交工单 <span style="font-size: 8px">${_data.createTime}</span></h3>
                                <p>${_data.submitterName}在${productName} ${moduleName}中创建【${_data.feedbackName}】工单，工单单号${_data.workOrderCode}</p>
                            </div>
                        </li>`;
            $('#claimedLifeCycleBoxList').append(claimedLifeCycleBoxListOne);
            admin.req('enterprisecab/work/admin/feedbackWorkOrder/tree', {workOrderId: _data.id}, res => {
                if (res.code === 200 && res.data) {
                    if (res.data.data.length > 0) {
                        messageReplyTimeline(res.data.data, parentData)
                    }
                }
            });
        }


        //消息回复时间轴
        function messageReplyTimeline(_date, _parentData) {
            if (_date && _date.length > 0) {
                let claimedLifeCycleBoxListTwoHtml = '';
                _date.forEach((item, index) => {
                    let claimedLifeCycleBoxListTwo = '';
                    claimedLifeCycleBoxListTwo += '<li class="layui-timeline-item">';
                    claimedLifeCycleBoxListTwo += '<i class="layui-icon layui-timeline-axis"></i>';
                    claimedLifeCycleBoxListTwo += '<div class="layui-timeline-content layui-text">';
                    claimedLifeCycleBoxListTwo += '<h3 class="layui-timeline-title">工单状态：' + item.recordStatus;
                    claimedLifeCycleBoxListTwo += '<span style="font-size: 8px;margin:0 10px;">' + item.createTime + '</span>';
                    if (item.recordStatus == '待认领') {
                        claimedLifeCycleBoxListTwo += '</h3>';
                        claimedLifeCycleBoxListTwo += '<p>' + item.createTime + '工单提交至平台，等待相关人员认领</p>';
                    } else if (item.recordStatus == '已认领') {

                        if (item.replierName != "") {
                            $('#replyContentBox').remove();
                            $('[lay-filter="replySubmit"]').remove();
                            if (index === 0) {
                                claimedLifeCycleBoxListTwo += `<button class="layui-btn layui-btn-xs" type="button" onclick="closeWorkOrder('${_parentData.id}','${_parentData.enterpriseStatus}')">已解决</button>`;
                                claimedLifeCycleBoxListTwo += `<button class="layui-btn layui-btn-xs" type="button" onClick="criticSubmit('${_parentData.id}','${_parentData.enterpriseStatus}')">未解决</button>`;
                            }
                            claimedLifeCycleBoxListTwo += '</h3>';

                            if (item.children.length > 0) {
                                claimedLifeCycleBoxListTwo += '<p class="criticTitle">' + item.children[0].replierName + '于' + item.children[0].createTime + '反馈如下内容</p>';
                                claimedLifeCycleBoxListTwo += '<div class="criticBox">';
                                claimedLifeCycleBoxListTwo += '<div class="criticUserImg">';
                                let userImg = item.children[0].userImg || 'assets/images/head.png';
                                claimedLifeCycleBoxListTwo += '<img src="' + userImg + '">';
                                claimedLifeCycleBoxListTwo += '</div>';
                                claimedLifeCycleBoxListTwo += '<div class="criticBoxNews" style="width: calc(100% - 50px)">';
                                claimedLifeCycleBoxListTwo += '<p class="criticBoxNewsHeader">' +  item.children[0].content + '</p>';
                                claimedLifeCycleBoxListTwo += '<div class="criticBoxNewsMain">';
                                claimedLifeCycleBoxListTwo += '<p class="">' + item.replierName + '于' + item.createTime + '反馈如下内容</p>';
                                claimedLifeCycleBoxListTwo += '<p>' + item.content + '</p>';
                                claimedLifeCycleBoxListTwo += '</div>';
                                if (item.confidential && item.confidential != '') {
                                    claimedLifeCycleBoxListTwo +='<div class="orderSecret"><label class="layui-form-label">机密信息：</label><div class="layui-input-inline orderSecretBox">';
                                    claimedLifeCycleBoxListTwo += encryption(item.confidential)+'</div></div>';
                                }

                            }else {
                                claimedLifeCycleBoxListTwo += '<p class="criticTitle">' + item.replierName + '于' + item.createTime + '反馈如下内容</p>';
                                claimedLifeCycleBoxListTwo += '<div class="criticBox">';
                                claimedLifeCycleBoxListTwo += '<div class="criticUserImg">';
                                let userImg = item.userImg || 'assets/images/head.png';
                                claimedLifeCycleBoxListTwo += '<img src="' + userImg + '">';
                                claimedLifeCycleBoxListTwo += '</div>';
                                claimedLifeCycleBoxListTwo += '<div class="criticBoxNews" style="width: calc(100% - 50px)">';
                                claimedLifeCycleBoxListTwo += '<p class="criticBoxNewsHeader">' + item.content + '</p>';
                                if (item.confidential && item.confidential != '') {
                                    claimedLifeCycleBoxListTwo +='<div class="orderSecret"><label class="layui-form-label">机密信息：</label><div class="layui-input-inline orderSecretBox">';
                                    claimedLifeCycleBoxListTwo += encryption(item.confidential)+'</div></div>';
                                }
                            }

                            /*claimedLifeCycleBoxListTwo += '<p class="criticTitle">' + item.replierName + '于' + item.createTime + '反馈如下内容</p>';
                            claimedLifeCycleBoxListTwo += '<div class="criticBox">';
                            claimedLifeCycleBoxListTwo += '<div class="criticUserImg">';
                            let userImg = item.userImg || 'assets/images/head.png';
                            claimedLifeCycleBoxListTwo += '<img src="' + userImg + '">';
                            claimedLifeCycleBoxListTwo += '</div>';
                            claimedLifeCycleBoxListTwo += '<div class="criticBoxNews" style="width: calc(100% - 50px)">';
                            claimedLifeCycleBoxListTwo += '<p class="criticBoxNewsHeader">' + item.content + '</p>';
                            if (item.children.length > 0) {
                                claimedLifeCycleBoxListTwo += '<div class="criticBoxNewsMain">';
                                claimedLifeCycleBoxListTwo += '<p class="">' + item.children[0].replierName + '于' + item.children[0].createTime + '反馈如下内容</p>';
                                claimedLifeCycleBoxListTwo += '<p>' + item.children[0].content + '</p>';
                                claimedLifeCycleBoxListTwo += '</div>';
                            }*/

                            claimedLifeCycleBoxListTwo += '</div>';
                            claimedLifeCycleBoxListTwo += '</div>';
                        } else {
                            claimedLifeCycleBoxListTwo += '</h3>';
                            claimedLifeCycleBoxListTwo += '<p>' + item.claimantName + '于' + item.createTime + '认领工单，计划工时' + item.planCompletionTime + '小时。工单等待处理中，请耐心等候</p>';
                        }
                    } else if (item.recordStatus == '已激活') {

                        if (index === 0) {
                            claimedLifeCycleBoxListTwo += `<button class="layui-btn layui-btn-xs" type="button" onclick="closeWorkOrder('${_parentData.id}','${_parentData.enterpriseStatus}')">已解决</button>`;
                            claimedLifeCycleBoxListTwo += `<button class="layui-btn layui-btn-xs" type="button" onClick="criticSubmit('${_parentData.id}','${_parentData.enterpriseStatus}')">未解决</button>`;
                        }
                        if (item.replierName != "") {
                            claimedLifeCycleBoxListTwo += '</h3>';

                            if (item.children.length > 0) {
                                claimedLifeCycleBoxListTwo += '<p class="criticTitle">' + item.children[0].replierName + '于' + item.children[0].createTime + '反馈如下内容</p>';
                                claimedLifeCycleBoxListTwo += '<div class="criticBox">';
                                claimedLifeCycleBoxListTwo += '<div class="criticUserImg">';
                                let userImg = item.children[0].userImg || 'assets/images/head.png';
                                claimedLifeCycleBoxListTwo += '<img src="' + userImg + '">';
                                claimedLifeCycleBoxListTwo += '</div>';
                                claimedLifeCycleBoxListTwo += '<div class="criticBoxNews" style="width: calc(100% - 50px)">';
                                claimedLifeCycleBoxListTwo += '<p class="criticBoxNewsHeader">' +  item.children[0].content + '</p>';
                                claimedLifeCycleBoxListTwo += '<div class="criticBoxNewsMain">';
                                claimedLifeCycleBoxListTwo += '<p class="">' + item.replierName + '于' + item.createTime + '反馈如下内容</p>';
                                claimedLifeCycleBoxListTwo += '<p>' + item.content + '</p>';
                                claimedLifeCycleBoxListTwo += '</div>';
                                if (item.confidential && item.confidential != '') {
                                    claimedLifeCycleBoxListTwo +='<div class="orderSecret"><label class="layui-form-label">机密信息：</label><div class="layui-input-inline orderSecretBox">';
                                    claimedLifeCycleBoxListTwo += encryption(item.confidential)+'</div></div>';
                                }
                            }else {
                                claimedLifeCycleBoxListTwo += '<p class="criticTitle">' + item.replierName + '于' + item.createTime + '反馈如下内容</p>';
                                claimedLifeCycleBoxListTwo += '<div class="criticBox">';
                                claimedLifeCycleBoxListTwo += '<div class="criticUserImg">';
                                let userImg = item.userImg || 'assets/images/head.png';
                                claimedLifeCycleBoxListTwo += '<img src="' + userImg + '">';
                                claimedLifeCycleBoxListTwo += '</div>';
                                claimedLifeCycleBoxListTwo += '<div class="criticBoxNews" style="width: calc(100% - 50px)">';
                                claimedLifeCycleBoxListTwo += '<p class="criticBoxNewsHeader">' + item.content + '</p>';
                                if (item.confidential && item.confidential != '') {
                                    claimedLifeCycleBoxListTwo +='<div class="orderSecret"><label class="layui-form-label">机密信息：</label><div class="layui-input-inline orderSecretBox">';
                                    claimedLifeCycleBoxListTwo += encryption(item.confidential)+'</div></div>';
                                }
                            }

                            /*claimedLifeCycleBoxListTwo += '<p class="criticTitle">' + item.replierName + '于' + item.createTime + '反馈如下内容</p>';
                            claimedLifeCycleBoxListTwo += '<div class="criticBox">';
                            claimedLifeCycleBoxListTwo += '<div class="criticUserImg">';
                            let userImg = item.userImg || 'assets/images/head.png';
                            claimedLifeCycleBoxListTwo += '<img src="' + userImg + '">';
                            claimedLifeCycleBoxListTwo += '</div>';
                            claimedLifeCycleBoxListTwo += '<div class="criticBoxNews" style="width: calc(100% - 50px)">';
                            claimedLifeCycleBoxListTwo += '<p class="criticBoxNewsHeader">' + item.content + '</p>';
                            if (item.children.length > 0) {
                                claimedLifeCycleBoxListTwo += '<div class="criticBoxNewsMain">';
                                claimedLifeCycleBoxListTwo += '<p class="">' + item.children[0].replierName + '于' + item.children[0].createTime + '反馈如下内容</p>';
                                claimedLifeCycleBoxListTwo += '<p>' + item.children[0].content + '</p>';
                                claimedLifeCycleBoxListTwo += '</div>';
                            }*/

                            claimedLifeCycleBoxListTwo += '</div>';
                            claimedLifeCycleBoxListTwo += '</div>';
                        }else {
                            claimedLifeCycleBoxListTwo += '</h3>';
                            claimedLifeCycleBoxListTwo += '<p>' + item.claimantName + '于' + item.createTime + '激活了工单</p>';
                        }

                    }else if (item.recordStatus == '已关闭') {
                        claimedLifeCycleBoxListTwo += '</h3>';
                        if(item.content!=''){
                            claimedLifeCycleBoxListTwo += '<p style="color: #FF0000;">' + item.content + '</p>';
                        }
                    }else {
                        claimedLifeCycleBoxListTwo += '</h3>';
                    }
                    claimedLifeCycleBoxListTwo += '</div></li>';
                    claimedLifeCycleBoxListTwoHtml += claimedLifeCycleBoxListTwo
                });
                console.log(claimedLifeCycleBoxListTwoHtml)
                $('#claimedLifeCycleBoxList').prepend(claimedLifeCycleBoxListTwoHtml);

            }
        }


        //上传附件
        function uploadImg(_elem, pathId, inputId) {
            upload.render({
                elem: '#' + _elem
                , url: config.upload_url + 'uploadFile'
                , data: {}
                , accept: 'file'
                , exts: 'jpg|png|RAR|zip|pdf|txt|doc|docx|xls|xlsx|ppt|pptx|apk'
                , headers: {Authorization: 'Bearer ' + config.getToken()}
                , done: function (res) {
                    if (res.code == 200) {
                        layer.msg(res.msg || "上传成功", {icon: 1});
                        let imagUrl = res.data.url;
                        $('#' + pathId).html(imagUrl);
                        $('#' + inputId).val(imagUrl);
                    } else if (res.code == 502) {
                        return location.replace('admin/login.html');
                    } else {
                        layer.msg(res.msg || "上传失败", {icon: 2});
                    }
                }
            });
        }

        //回复消息弹窗
        criticSubmit = function (id, _status) {
            var criticFormId = admin.open({
                type: 1,
                area: ['600px', '450px'],
                offset: '85px',
                title: '消息回复',
                content: $('#criticForm').html(),
                success: function () {
                    //请求要回复的消息
                    admin.req('enterprisecab/work/admin/feedbackWorkOrder/getLatestByWordOrderId', {wordOrderId: id}, res => {
                        if (res.code === 200 && res.data) {
                            if (res.data.data) {
                                $('#criticFormContent').val(res.data.data.content);
                                $('#criticFormReplierName').text(res.data.data.replierName ||res.data.data.claimantName);
                                $('#criticFormCreateTime').text(res.data.data.createTime);
                            }
                        }
                    });

                    // 提交回复消息
                    form.on('submit(criticFormSubmit)', function (d) {
                        let criticFormSubmitData = {
                            workOrderId: id,
                            status: _status,
                            content: d.field.content,
                            confidential:d.field.confidential,
                            replyStatus: 2
                        };

                        admin.req('enterprisecab/work/admin/feedbackWorkOrder/reply', criticFormSubmitData, res => {
                            layer.load(2);
                            if (res.code === 200) {
                                layer.closeAll('loading');
                                layer.close(criticFormId);
                                layer.msg(res.data.msg, {icon: '1'});
                                timelineData(parentData)
                            }
                        }, 'post');
                    })


                }
            })
        };
        // 关闭工单
        closeWorkOrder = function (id, _status) {
            layer.confirm('确认关闭工单吗？', {
                offset: '65px',
                skin: 'layui-layer-admin'
            }, function (i) {
                layer.close(i);
                layer.load(2);
                admin.req('enterprisecab/work/admin/feedbackWorkOrder/closeWorkOrder/'+id, {}, function (res) {
                    layer.closeAll('loading');
                    if (res.code == 200) {
                        layer.msg(res.msg, {icon: 1});
                        layer.closeAll();
                        table.reload('feedbackWorkOrderTable');
                    } else {
                        layer.msg(res.msg, {icon: 2});
                    }
                }, 'PUT');
            });
        };

        // 导出excel
        $('#feedbackWorkOrderBtnExport').click(function () {
            var checkRows = table.checkStatus('feedbackWorkOrderTable');
            if (checkRows.data.length == 0) {
                layer.msg('请选择要导出的数据', {icon: 2});
            } else {
                table.exportFile(insTb.config.id, checkRows.data, 'xls');
            }
        });

        // 文本加密
        function encryption(_data) {
            let str = '';
            if (_data) {
                for (let i = 0; i < _data.length; i++) {
                    str += String.fromCharCode(_data.charCodeAt(i) - 100);
                }
            } else {
                str = _data
            }
            return str;
        }

        function untie(_data) {
            let str = '';
            if (_data) {
                for (let i = 0; i < _data.length; i++) {
                    str += String.fromCharCode(_data.charCodeAt(i) + 100);
                }
            } else {
                str = _data
            }
            return str;
        }

        //渲染下拉框
        function loadSelectHtml(data, tips, htmltarget, type, formName) {
            let html = ' <option value>' + tips + '</option>';
            if (!data || data == null) {
                return;
            }
            for (let i = 0; i < data.length; i++) {
                if (type == 1) {
                    html += `<option value='${data[i].id}'>${data[i].name}</option>`;
                }
            }

            $("form[name='" + formName + "'] select[name='" + htmltarget + "']").html(html);
            form.render('select');
        }

    });
</script>